<template>
  <div>
    <el-form
      :model="policyForm"
      :rules="policyRules"
      ref="policyForm"
      class="query-form"
      size="small"
      label-width="150px"
    >
      <div class="haryuki-text-bold haryuki-m-b-10">基础信息设置</div>
      <el-row :gutter="20">
        <el-col :span="8">
          <el-form-item label="通道政策名称:" prop="policyName">
            <el-input
              size="small"
              v-model="policyForm.policyName"
              placeholder="请输入政策名称"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="选择通道:" prop="aisleCode">
            <el-select
              size="small"
              v-model="policyForm.aisleCode"
              @change="aisleChange"
              placeholder="请选择通道"
            >
              <el-option
                v-for="item in aisleList"
                :key="item.aisleCode"
                :label="item.aisleName"
                :value="item.aisleCode"
              >
              <span style="float: left">{{ item.aisleName }}</span>
              <span style="float: right; color: #8492a6; font-size: 13px">{{
                item.aisleCode
              }}</span>
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8" v-if="policyForm.aisleCode">
          <el-form-item label="通道商名称:" prop="aisleCompanyName">
            <el-input
              class="disabled-view"
              size="small"
              v-model="policyForm.aisleCompanyName"
              placeholder="请选择通道商名称"
              disabled
              clearable
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8" v-if="policyForm.aisleCode">
          <el-form-item label="通道简称:" prop="aisleKindName">
            <el-input
              class="disabled-view"
              size="small"
              v-model="policyForm.aisleKindName"
              placeholder="请选择通道简称"
              disabled
              clearable
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8" v-if="policyForm.aisleCode">
          <el-form-item label="通道类型:" prop="aisleTypeName">
            <el-input
              class="disabled-view"
              size="small"
              v-model="policyForm.aisleTypeName"
              placeholder="请选择通道类型"
              disabled
              clearable
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8" v-if="policyForm.aisleCode">
          <el-form-item label="接入类型:" prop="aisleMerchantTypeName">
            <el-input
              class="disabled-view"
              size="small"
              v-model="policyForm.aisleMerchantTypeName"
              placeholder="请选择接入类型"
              disabled
              clearable
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="分润类型:" prop="profitType">
            <el-select
              size="small"
              v-model="policyForm.profitType"
              placeholder="请选择分润类型"
            >
              <el-option
                :label="item.dictValue"
                :value="Number(item.dictKey)"
                v-for="(item, index) in polTypeList"
                :key="index"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="发放类型:" prop="ruleType">
            <el-select
              size="small"
              v-model="policyForm.ruleType"
              placeholder="请选择发放类型"
            >
              <el-option
                :label="item.dictValue"
                :value="Number(item.dictKey)"
                v-for="(item, index) in ruleTypeList"
                :key="index"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="是否分账:" prop="isShare">
            <el-select
              size="small"
              v-model="policyForm.isShare"
              placeholder="请选择是否分账"
            >
              <el-option
                :label="item.dictValue"
                :value="Number(item.dictKey)"
                v-for="(item, index) in isShareList"
                :key="index"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <div class="haryuki-text-bold haryuki-m-b-10 haryuki-m-t-20">状态信息设置</div>
      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item label="通道政策状态:" prop="policyStatus">
            <el-radio-group v-model="policyForm.policyStatus">
              <el-radio :label="1">正常</el-radio>
              <el-radio :label="0">关闭</el-radio>
            </el-radio-group>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="通道政策交易状态:" prop="tradeStatus">
            <el-radio-group v-model="policyForm.tradeStatus">
              <el-radio :label="1">正常</el-radio>
              <el-radio :label="0">禁止交易</el-radio>
            </el-radio-group>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="通道政策分配状态:" prop="allotStatus">
            <el-radio-group v-model="policyForm.allotStatus">
              <el-radio :label="1">正常</el-radio>
              <el-radio :label="0">禁止分配</el-radio>
            </el-radio-group>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="通道政策开户状态:" prop="openRpiStatus">
            <el-radio-group v-model="policyForm.openRpiStatus">
              <el-radio :label="1">正常</el-radio>
              <el-radio :label="0">禁止开户</el-radio>
            </el-radio-group>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
  </div>
</template>

<script>
import { getDictionary } from "@/api/system/dict";
import { getList as getAisleList, getDetail as getAisleDetail } from "@/api/rb-core/aislePay/aisle_pay";

let intId = 1;
export default {
  props: {
    policyForm: Object,
  },
  components: {
  },
  data() {
    return {
      policyRules: {
        aisleCode: [{ required: true, message: "请选择通道", trigger: "blur" }],
        policyName: [
          { required: true, message: "请输入政策名称", trigger: "blur" },
        ],
        profitType: [
          { required: true, message: "请选择分润类型", trigger: "blur" },
        ],
        ruleType: [
          { required: true, message: "请选择发放类型", trigger: "blur" },
        ],
        isShare: [
          { required: true, message: "请选择是否分账", trigger: "blur" },
        ],
        policyStatus: [
          { required: true, message: "请选择通道政策状态", trigger: "blur" },
        ],
        tradeStatus: [
          { required: true, message: "请选择交易状态", trigger: "blur" },
        ],
        allotStatus: [
          { required: true, message: "请选择分配状态", trigger: "blur" },
        ],
        openRpiStatus: [
          { required: true, message: "请选择开户状态", trigger: "blur" },
        ],
      },
      aisleList: [], // 一键全入 模板集合
      polTypeList: [],
      ruleTypeList: [],
      isShareList: [],
      data: {}, //通道政策 树形数据
    };
  },
  computed: {
    /* 垫资 ylType 1.扫码垫资 2.贷记卡垫资 3.借记卡垫资 */
    codeAdvanceRateTypeName() {
      return (val) => {
        if (val == 1) {
          return (val = '扫码垫资');
        } else if (val == 2) {
          return (val = '贷记卡垫资');
        } else if (val == 3) {
          return (val = '借记卡垫资');
        }
      };
    },
    /* 刷卡 payType 1.贷记卡 2.借记卡 */
    posRateTypeName() {
      return (val) => {
        if (val == 1) {
          return (val = '贷记卡');
        } else if (val == 2) {
          return (val = '借记卡');
        }
      };
    },
    /* 云闪付 ylType 1.贷记卡小额 2.借记卡小额 3.贷记卡大额 4.借记卡大额 */
    ysfRateTypeName() {
      return (val) => {
        if (val == 1) {
          return (val = '贷记卡');
        } else if (val == 2) {
          return (val = '借记卡');
        } else if (val == 3) {
          return (val = '贷记卡');
        } else if (val == 4) {
          return (val = '借记卡');
        }
      };
    },
    /* 云闪付 大小额分层 */
    ysfRateList() {
      return (unionRate, type) => {
        if (type == 1) {
          return unionRate.filter(item => item.ylType == 1 || item.ylType == 2)
        } else if (type == 2) {
          return unionRate.filter(item => item.ylType == 3 || item.ylType == 4)
        }
      };
    }
  },
  watch: {
  },
  created() {
    this.data = {};
    this.doGetDicts();
    this.getAisleSelect();
  },
  methods: {
    /* 字典 */
    doGetDicts() {
      getDictionary({ code: "policy_profit_type" }).then((res) => {
        this.polTypeList = res.data.data;
      });
      getDictionary({ code: "policy_rule_type" }).then((res) => {
        this.ruleTypeList = res.data.data;
      });
      getDictionary({ code: "policy_is_share" }).then((res) => {
        this.isShareList = res.data.data;
      });
    },
    /* 通道查询 */
    getAisleSelect() {
      getAisleList("-1", "-1").then((res) => {
        this.aisleList = res.data.data.records;
      });
    },
    /* 通道选择 回显赋值政策 */
    async aisleChange(e) {
      await this.$emit('aisleChange', e);
      await getAisleDetail(e).then((res) => {
        if (res.data.code == "200") {
          const data = res.data.data;
          this.policyForm.aisleKindName = data.aisleKindName;
          this.policyForm.aisleTypeName = data.aisleTypeName;
          this.policyForm.aisleMerchantTypeName = data.aisleMerchantTypeName;
        } else {
          this.$message({
            type: "error",
            message: res.data.message,
          });
        }
      });
    },
    /* input 数值检验 */
    proving(e) {
      var keynum = window.event ? e.keyCode : e.which;   //获取键盘码
      // var keychar = String.fromCharCode(keynum);  //获取键盘码对应的字符
      if (keynum == 189 || keynum == 109) { //禁止输入负数
        e.target.value = 0
      }
      // if (e.target.value.indexOf('.') == 1) { //如果值里面有’.‘的话，进去检测位小数点大于1位的话只保留一位
      //     var x = String(e.target.value).indexOf(".")+4;//得到小数点的位置
      //     var y = String(e.target.value).length - x;//小数点的位数
      //     if(y > 1){
      //         e.target.value = this.getBit(e.target.value, 4)
      //     }
      // }
      if (e.target.value.indexOf(".") != -1) {
        e.target.value = e.target.value.replace(/\.{2,}/g, '.')
        if (e.target.value.length > 6) {
          e.target.value = e.target.value.substr(0, e.target.value.length - 1)
        }
      }
      // if (e.target.value > 1) {
      //     e.target.value = 1
      // }
    },
  },
};
</script>

<style lang="scss" scoped>
.haruyuki-width-100{
  // width: 300px !important;
  width:inherit;
}
.w100{
  width: 100%;
}
.p_L10{
  padding-left: 4px !important;
}

.haryuki-text-bold {
  font-weight: bold;
  text-align: center;
  border-bottom: 1px solid #e4e7ed;
  padding-bottom: 10px;
}

.haryuki-m-b-10 {
  margin-bottom: 10px;
}

::v-deep .disabled-view .el-input__inner {
  background: #F5F7FA !important;
  color: #73757a;
}
</style>